<template>
	<main-layout :breadcrumbs="breadcrumbs">
		<template slot-scope="{height}">
			<Tabs type="card">
				<TabPane label="发起流程">
					<start-process></start-process>
				</TabPane>
				<TabPane label="我的流程">
					<my-process></my-process>
				</TabPane>
				<TabPane label="待办事项">
					<todo-task></todo-task>
				</TabPane>
				<TabPane label="已办事项">
					<complete-task></complete-task>
				</TabPane>
			</Tabs>
			<svg height="0" width="0">
				<defs>
					<marker id="sequenceflow" viewBox="0 0 20 20" refX="11" refY="10" markerWidth="10" markerHeight="10" orient="auto">
						<path d="M 1 5 L 11 10 L 1 15 Z" style="fill: #e13d13; stroke-width: 1px; stroke-linecap: round; stroke-dasharray: 10000, 1; stroke: #e13d13;"></path>
					</marker>
				</defs>
			</svg>
		</template>
	</main-layout>
</template>

<script language="JavaScript">
	
import startProcess from './start-process';
import myProcess from './my-process';
import todoTask from './todo-task';
import completeTask from './complete-task';

export default {
	components: {
		startProcess,
		myProcess,
		todoTask,
		completeTask
	},
	data() {
		return {
			breadcrumbs: [
				{name: '任务列表'}
			]
		};
	},
	computed: {},
	watch: {},
	created: function() {},
	mounted: function() {
		this.$nextTick(() => {
		});
	},
	methods: {
	}
};
</script>
<style lang="scss">
.ivu-tabs-bar {
	margin: 0 !important;
}
.ivu-tabs {
	display: flex;
	flex-direction: column;
	height: 100%;
	.ivu-tabs-content {
		flex: 1 !important;
	}
}
</style>
<!-- 流程图绘制公共部 CSS -->
<style lang="scss">
.bjs-powered-by {
	display: none;
}
</style>
